﻿@{
    ViewBag.Title = "登录日志";
}
@section headerSection{
    <style>
        #exampleToolbar > .form-group {
            float: left;
            margin: 0;
            margin-left: 5px;
        }
    </style>
}
<div class="animated fadeInRight">
    <!-- Panel Other -->
    <div class="ibox float-e-margins" style="margin-bottom: 0px;">
        <div class="ibox-content" style="padding: 5px 20px 0px 20px;">
            <div class="row row-lg">
                <div class="col-sm-12 col-sm-leftRight">
                    <!-- Example Toolbar -->
                    <div class="example">
                        <div class="btn-group hidden-xs" id="exampleToolbar" role="group">
                            <button id="logDetail" type="button" class="btn btn-outline btn-primary">
                                <i class="glyphicon glyphicon-th-large" aria-hidden="true">详细</i>
                            </button>
                            <div class="form-group" style="width:200px;">
                                <input id="userName" name="userName" type="text" class="form-control" placeholder="用户名/登录名">
                            </div>
                            <div class="form-group" style="margin-top:-2px;width:300px;">
                                <select id="orgUnit" name="orgUnit" data-live-search="true" data-size="8" class="form-control show-tick selectpicker" placeholder="请选择所属单位"></select>
                            </div>
                            <div class="form-group" style="margin-top:-2px;width:140px;">
                                <select id="status" name="status" class="form-control show-tick selectpicker" placeholder="请选择状态">
                                    <option value="-1">全部</option>
                                    <option value="1">在线</option>
                                    <option value="0">离线</option>
                                </select>
                            </div>
                            <div class="form-group" style="margin-top:-2px;width:140px;">
                                <select id="orderColumn" name="orderColumn" class="form-control show-tick selectpicker" placeholder="请选择排序字段">
                                    <option value="login_time" selected>登录时间</option>
                                    <option value="last_time">最后请求时间</option>
                                    <option value="login_count">登录次数</option>
                                </select>
                            </div>
                            <div class="form-group" style="margin-top:-2px;width:140px;">
                                <select id="orderType" name="orderType" class="form-control show-tick selectpicker" placeholder="请选择排序类型">
                                    <option value="desc" selected>倒序</option>
                                    <option value="asc">升序</option>
                                </select>
                            </div>
                            <div class="form-group" style="margin-top:-2px;width:140px;">
                                <select id="loginSource" name="loginSource" class="form-control show-tick selectpicker" placeholder="请选择登录来源">
                                    <option value="" selected>全部</option>
                                </select>
                            </div>
                            <div class="form-group">
                                <button id="btnSearch" class="btn btn-primary" type="button"><i class="fa fa-search"></i>&nbsp;查询</button>
                            </div>
                        </div>
                        <table id="exampleTableToolbar" data-mobile-responsive="true" data-radio="true"></table>
                    </div>
                    <!-- End Example Toolbar -->
                </div>
            </div>
        </div>
    </div>
    <!-- End Panel Other -->
</div>
@section footSection{
    <script>
        var options, $table;
        var logManager = {
            initPage: function () {
                logManager.initTable();
                logManager.initSelect();
                logManager.bindEvent();
            },
            //初始化Table
            initTable: function() {
                options = {
                    url: ctx + "/SysLog/GetLoginListData",
                    cutHeight: 5,
                    toolbar: "#exampleToolbar",
                    queryParams: function(params) {
                        params = {
                            //页面大小
                            rows: params.limit,
                            //第几页
                            page: params.offset / params.limit + 1,
                            userName: ($('#userName').val()) ? encodeURI($('#userName').val()) : "",
                            orgUnit: $('#orgUnit').val(),
                            status: $('#status').val(),
                            orderColumn: $('#orderColumn').val(),
                            orderType: $('#orderType').val(),
                            loginSource: $('#loginSource').val()
                        }
                        return params;
                    },
                    columns: [
                        {
                            radio: true
                        }, {
                            field: '', //第一列序号
                            title: '序号',
                            align: 'center',
                            width: 50,
                            formatter: function(value, row, index) {
                                return index + 1;
                            }
                        }, {
                            field: 'user_name',
                            title: '用户名',
                            align: 'center'
                        }, {
                            field: 'login_name',
                            title: '登录名',
                            align: 'center'
                        }, {
                            field: 'user_unit',
                            title: '所属单位',
                            align: 'center'
                        }, {
                            field: 'status',
                            title: '状态',
                            align: 'center',
                            formatter: function (value, row, index) {
                                if (value===1)
                                    return "<span class='label label-primary'>在线</span>";
                                else
                                    return "<span class='label label-warning'>离线</span>";
                            }
                        }, {
                            field: 'login_time',
                            title: '登录时间',
                            align: 'center'
                        }, {
                            field: 'last_time',
                            title: '最后请求时间',
                            align: 'center'
                        }, {
                            field: 'login_count',
                            title: '登录次数',
                            align: 'center'
                        }, {
                            field: 'source',
                            title: '最后登录来源',
                            align: 'center',
                            formatter: function (value, row, index) {
                                switch (value) {
                                    case "mobile": return "移动设备"; break;
                                    case "wechat": return "微信"; break;
                                    case "web": return "浏览器"; break;
                                    case "pc": return "PC客户端"; break;
                                    case "app": return "App"; break;
                                    case "vr": return "VR设备"; break;
                                    case "bm": return "后台管理"; break;
                                    default: return value; break;
                                }
                            }
                        }]
                }
                $table = tableHelper.initTable("exampleTableToolbar", options);
            },
            initSelect:function(){
                $.ajax({
                    url: ctx + '/SysCommon/GetDictionaryByCode',
                    type: "post",
                    cache: false,
                    async: false,
                    data: { fieldCode: 'SysUserUnit' },
                    dataType: 'json',
                    success: function (data) {
                        if (data.Statu === 1) {
                            layer.msg(data.Msg, { icon: 5 });
                            return false;
                        }
                        var itemStr = "<option value=''>全部</>";
                        $.each(data.Data, function (i, item) {
                            itemStr += "<option value='" + item.code_value + "'>" + item.code_name + "</option>";
                        });
                        $('#orgUnit').append(itemStr);//查询
                    },
                    error: function () {
                        layer.msg('数据异常~', { icon: 5 });
                    }
                });
                $('#loginSource').initSelectpicker("loginSource");
            },
            //绑定事件
            bindEvent: function() {
                //查询
                $('#btnSearch').click(function () {
                    $table.bootstrapTable('refresh', options);
                });
                //详细
                $('#logDetail').click(function () {
                    var row = $table.bootstrapTable('getSelections');
                    if (row && row.length === 0) {
                        layer.msg("未选中行~", { icon: 5 });
                        return false;
                    }
                    layer.open({
                        title: ['登录详情', 'font-size:18px;'],
                        type: 2,
                        content: ctx + "/SysLog/LoginDetial?user_id="+row[0].user_id,
                        scroll: true, //是否显示滚动条、默认不显示
                        btn: null,
                        area: ['800px', '90%']
                    });
                });
            }
        }
        $(function() {
            logManager.initPage();
        });
    </script>
}